<template>
  <a-modal
    :title="isEdit ? '修改预分配单' : '添加预分配单'"
    :visible.sync="topAddShow"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    :maskClosable="false"
    width="30%"
    class="basic-modal"
  >
    <div class="title">
      <a-form-model
        :label-col="{ span: 6 }"
        :wrapper-col="{ span: 14 }"
        :model="essenceItem"
        ref="form"
      >
        <a-form-model-item label="预分配单号">
          <a-input
            style="width: 75%"
            v-model="essenceItem.OrderCode"
            placeholder="不填写自动生成"
          />
        </a-form-model-item>
        <a-form-model-item label="计划单号">
          <a-input
            style="width: 75%; margin-right: 5px"
            disabled
            v-model="essenceItem.PackingPlanNo"
          />
          <!-- <a-button class="default-button" @click="boottleFun"> 选择 </a-button> -->
        </a-form-model-item>
        <!-- <a-form-model-item label="投料单号">
          <a-textarea
            disabled
            style="resize: none; width: 75%; margin-right: 5px"
            v-model="formItem.planNoText"
          />
          <a-button class="default-button" @click="feedFun"> 选择 </a-button>
        </a-form-model-item> -->
        <a-form-model-item label="超分配比例(%)">
          <a-input
            style="resize: none; width: 75%"
            v-model="essenceItem.AllocationRatio"
          />
        </a-form-model-item>
        <a-form-model-item label="备注">
          <a-textarea
            style="resize: none; width: 75%"
            v-model="essenceItem.Remarks"
          />
        </a-form-model-item>
      </a-form-model>
    </div>

    <boottle-form v-model="boottleShow" @up-data="orderItemFun"></boottle-form>

    <feeding-form
      v-model="feedShow"
      :packingPlanID="essenceItem.PackingPlanID"
      @up-data="feedtemFun"
    ></feeding-form>
  </a-modal>
</template>
  
  <script>
import BoottleForm from "./table-selection-form.vue";

import FeedingForm from "./feeding-selcetion-form.vue";
import {
  insSemiMGoodsDistribute,
  updSemiMGoodsDistribute,
} from "@/api/SemiMGoodsDistribute/index";
export default {
  components: {
    BoottleForm,
    FeedingForm,
  },
  props: {
    topAddShow: {
      type: Boolean,
      default: false,
    },
    essenceItem: {
      type: Object,
      default: {},
    },
    isEdit: {
      type: Boolean,
      default: false,
    },
  },
  model: {
    prop: "topAddShow",
    event: "close",
  },

  data() {
    return {
      boottleShow: false,
      feedShow: false,
      confirmLoading: false, //modal的loading
      formItem: {
        planNoText: null,
        packingPlanNo: null,
        PackingPlanID: null,
      },
    };
  },
  methods: {
    /** 新增精华液预分配 */
    async insData() {
      this.confirmLoading = true;
      try {
        let res = await insSemiMGoodsDistribute(this.essenceItem);
        if (res.Status == 10000) {
          this.$message.success("添加成功");
          this.formItem = {
            planNoText: null,
            packingPlanNo: null,
            PackingPlanID: null,
          };

          this.$emit("up-data");
        }
      } catch (e) {
        this.$message.error(e);
      } finally {
        this.confirmLoading = false;
      }
    },

    /** 修改精华液预分配 */
    async upData() {
      this.confirmLoading = true;
      try {
        let res = await updSemiMGoodsDistribute(this.essenceItem);
        if (res.Status == 10000) {
          this.$message.success("修改成功");
          this.formItem = {
            planNoText: null,
            packingPlanNo: null,
            PackingPlanID: null,
          };

          this.$emit("up-data");
        }
      } catch (e) {
        this.$message.error(e);
      } finally {
        this.confirmLoading = false;
      }
    },

    //关闭弹窗
    handleCancel() {
      this.formItem = {
        planNoText: null,
        packingPlanNo: null,
        PackingPlanID: null,
      };
      this.$emit("close", false);
    },
    //确认添加/修改
    handleOk() {
      if (!this.essenceItem.PackingPlanID)
        return this.$message.error("请先选择灌装单号");
      // if (this.formItem.planNoText == null)
      //   return this.$message.error("请先选择投料单号");
      if (!this.isEdit) {
        this.insData();
      } else {
        this.upData();
      }
    },

    /** 选择灌装单 */
    boottleFun() {
      this.boottleShow = true;
    },

    /** 灌装单赋值 */
    orderItemFun(item) {
      this.essenceItem.PackingPlanID = item.PackingPlanID;
      this.formItem.packingPlanNo = item.PackingPlanNo;
      this.essenceItem.PlanNos = [];
      this.formItem.planNoText = [];
      this.boottleShow = false;
    },

    /** 选择投料单 */
    feedFun() {
      if (!this.essenceItem.PackingPlanID) {
        return this.$message.error("请先选择灌装单号");
      }
      this.feedShow = true;
    },

    /** 投料单赋值 */
    feedtemFun(item) {
      this.essenceItem.PlanNos = item.expandedRowKeys;
      this.formItem.planNoText = item.expandedRowKeys.join(",");
    },
    //表格选择
    handleTableChange() {},
  },

  watch: {
    topAddShow: {
      handler(newV, oldV) {
        if (newV) {
          if (this.isEdit) {
            this.formItem.packingPlanNo = this.essenceItem.PackingPlanNo;
            this.formItem.planNoText = this.essenceItem.PlanNo;
            if (this.essenceItem.PlanNo) {
              this.essenceItem.PlanNos = this.essenceItem.PlanNo.split(",");
            }
          }
        }
      },
      immediate: true, // 重点
      deep: true, // 重点
    },
  },
};
</script>
  
  <style lang="less" scoped></style>
  